.myselect{
	position:relative;
	display:inline-block;
}
.myselect select{
	display:inline-block;
	border:1px solid #bbb;
	padding:4px 3px 3px 5px;
	margin:0;
	font:inherit;
	line-height:1.2;
	outline:none;
	background: #f8f8f8;
	-webkit-appearance:none; /* remove the strong OSX influence from Webkit */
        
        -webkit-border-radius: 2px;
        -moz-border-radius: 2px;
        border-radius: 5px;

}

 .myselect select:focus {
        -webkit-box-shadow: 0 0 3px 1px #c00;
        -moz-box-shadow: 0 0 3px 1px #c00;
        box-shadow: 0 0 3px 1px #c00;
 }

span.custom-select {
    position: relative;
    display: inline-block;
}

  .custom-select select {
        display: inline-block;
        border: 2px solid #bbb;
        padding: 4px 3px 3px 5px;
        margin: 0;
        font: inherit;
        outline:none; /* remove focus ring from Webkit */
        line-height: 1.6;
        background: #f8f8f8;
        
        -webkit-appearance:none; /* remove the strong OSX influence from Webkit */
        
        -webkit-border-radius: 2px;
        -moz-border-radius: 2px;
        border-radius: 5px;
    }

    /* for Webkit's CSS-only solution */
    @media screen and (-webkit-min-device-pixel-ratio:0) { 
        .custom-select select {
            padding-right:30px;    
        }
    }
    
    /* Since we removed the default focus styles, we have to add our own */
    .custom-select select:focus {
        -webkit-box-shadow: 0 0 3px 1px #c00;
        -moz-box-shadow: 0 0 3px 1px #c00;
        box-shadow: 0 0 3px 1px #c00;
    }
    
    /* Select arrow styling */
    .custom-select:after {
        content: "\25bc";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        font-size: 60%;
        line-height: 30px;
        padding: 0 7px;
        background: #bbb;
        color: white;
        
        pointer-events:none;
        
        -webkit-border-radius: 0 6px 6px 0;
        -moz-border-radius: 0 6px 6px 0;
        border-radius: 0 6px 6px 0;
    }
    
    .no-pointer-events .custom-select:after {
        content: none;
    }

#searchForm{
	/* The search form. */
	background-color:#4C5A65;
	padding:3px 3px 3px;
	margin:50px 0;
	position:relative;

	-moz-border-radius:16px;
	-webkit-border-radius:16px;
	border-radius:5px;
}

fieldset{
	border:none;
}

#searchInputContainer{
	/* This div contains the transparent search box */
	width:140px;
	height:36px;
	background:url("../../searchBox1.png") no-repeat;
	float:left;
	margin-right:12px;
}

#s{
	/* The search text box. */
	
	border:none;
	color:#888888;
	background:url("../img/searchBox1.png") no-repeat;
	
	float:left;
	font-size:13px;
	height:36px;
	line-height:3px;
	margin-right:6px;
	outline:medium none;
	padding:0 0 0 30px;
	text-shadow:1px 1px 0 white;
	width:130px;
}

/* The UL that contains the search type icons */

.icons{
	list-style:none;
	margin:10px 0 0 335px;
	height:19px;
	position:relative;
}

.icons li{
	background:url("img/icons.png") no-repeat;
	float:left;
	height:19px;
	text-indent:-9999px;
	cursor:pointer;
	margin-right:5px;
}

/* Styling each icon */

li.web{ width:15px;}
li.web.active,
li.web:hover{ background-position:left bottom;}

li.images{ width:22px; background-position:-18px 0;}
li.images.active,
li.images:hover{ background-position:-18px bottom;}

li.news{ width:14px; background-position:-44px 0;}
li.news.active,
li.news:hover{ background-position:-44px bottom;}

li.videos{ width:17px; background-position:right 0;}
li.videos.active,
li.videos:hover{ background-position:right bottom;}



/* The submit button */


#submitButton{
	background:url('../img/buttons.png') no-repeat;
	width:83px;
	height:36px;
	text-indent:-9999px;
	overflow:hidden;
	text-transform:uppercase;
	border:none;
	cursor:pointer;
}

#submitButton:hover{
	background-position:left bottom;
}


/* The Search tutorialzine.com / Search the Web radio buttons */


#searchInContainer{
	float:left;
	margin-top:12px;
	width:330px;
}

input[type=radio]{
	cursor:pointer;
	/*float:left;*/
}


/* Styling the search results */


.pageContainer{
	/* Holds each page with search results. Has an inset bottom border. */
	border-bottom:1px solid #5e7481;
	margin-bottom:50px;
	
	/* Adding a dark bottom border with box shadow */
	
	-moz-box-shadow:0 1px 0 #798e9c;
	-webkit-box-shadow:0 1px 0 #798e9c;
	box-shadow:0 1px 0 #798e9c;
}



/* Image & video search results */


.imageResult{
	float:left;
	height:180px;
	margin:0 0 20px 40px;
	text-align:center;
	width:152px;
	overflow:hidden;
}
.imageResult img{ display:block;border:none;}
.imageResult a.pic{
	border:1px solid #fff;
	outline:1px solid #777;
	display:block;
	margin:0 auto 15px;
}

/* The show more button */

#more{
	width:83px;
	height:24px;
	background:url('../img/more.png') no-repeat;
	cursor:pointer;
	margin:40px auto;
}

#more:hover{
	background-position:left bottom;
}

.clear{
	clear:both;
}

/* -- Styled Selects - wrapped due to FF appearance bug & MSIE -- */
.styled_select {display: block; position: relative; margin: 0; padding: 0; width: auto; height: auto; border: 1px solid #ccc; overflow: hidden; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: 0 0 0 3px #f5f5f5; -moz-box-shadow: 0 0 0 3px #f5f5f5; -o-box-shadow: 0 0 0 3px #f5f5f5; -khtml-box-shadow: 0 0 0 3px #f5f5f5; box-shadow: 0 0 0 3px #f5f5f5;}
.styled_select.match-width {display: inline-block; *display: inline; zoom: 1;}
.styled_select {
background-color: #ffffff;
background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f1f1f1));
background-image: -webkit-linear-gradient(top, #ffffff, #f1f1f1);
background-image: -moz-linear-gradient(top, #ffffff, #f1f1f1);
background-image: -o-linear-gradient(top, #ffffff, #f1f1f1);
background-image: -ms-linear-gradient(top, #ffffff, #f1f1f1);
background-image: linear-gradient(top, #ffffff, #f1f1f1);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffffff', EndColorStr='#f1f1f1');
}
.styled_select select {position: relative; display: block; margin: 0; padding: 9px 32px 9px 12px; white-space: nowrap; width: 100%; font-size: 13px; font-size: 1.3rem; color: #666666; font-family: 'Open Sans', sans-serif; font-weight: 600; font-style: normal; border: none; background: transparent; cursor: pointer; -moz-appearance: window; -webkit-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; outline: none; z-index: 2;}
.styled_select select::-ms-expand {display: none;}
.styled_select:hover {border: 1px solid #00adf1;}
.styled_select:after {position: absolute; top: 0; right: 0; width: 32px; height: 100%; speak: none; content: ''; z-index: 1;}
.styled_select:before {position: absolute; top: 50%; right: 12px; width: 8px; height: 4px; margin: -2px 0 0 -4px; background: url(../i/select_arrow.png) no-repeat center center; speak: none; content: '';}
.ie8 .styled_select select,
.ie9 .styled_select select {padding-right: 12px;}
.ie8 .styled_select:after,
.ie9 .styled_select:after,
.ie8 .styled_select:before,
.ie9 .styled_select:before {display: none;}
.dropdownvisible_demo2 {
	height: 200px;
	overflow-y: scroll;
	}